<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
  <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" />
  <script th:src="@{/js/vue.js}"></script>
</head>
<body>
<div th:insert="publicHesder"></div>
<script th:src="@{/js/publicHeader.js}"></script>
<div class="container-fluid" id="app" style="margin-top: 180px;margin-bottom: 100px">

<div class="container">

  <div class="row">
    <a href="/login.html">已有账号?立即去登录</a>
    <div class="col-md-4 col-md-offset-4" style="border: 1px solid #cccccc ;border-radius: 5px;margin-top: 10px">
      <form action="/user/reg" method="post">
        <p style="color: red" th:text="${errorInfo}">errorInfo</p>
        <div class="form-group">
          <label for="account">用户名:</label>
          <input type="text" v-model="registerForm.username" name="username" class="form-control" id="account" placeholder="请输入用户名">
        </div>
        <div class="form-group">
          <label for="password">密码</label>
          <input type="password" v-model="registerForm.password" name="password" class="form-control" id="password" placeholder="请输入密码">
        </div>
        <div class="form-group">
          <label for="repass">确认密码:</label>
          <input type="password" v-model="registerForm.secondPassword" name="repass" class="form-control" id="repass" placeholder="请输入确认密码">
        </div>

        <button type="submit" class="btn btn-success" @click.prevent="toRegister">注册</button>
      </form>
    </div>
  </div>

</div>


</div>

<script>

  console.log(".........register...........")

  let register = new Vue({
    el: "#app"
    ,
    data: {
      registerForm:{
        username:'',
        password:'',
        secondPassword:''
      }

    }
    ,
    methods: {
      toRegister(){
        let _this = this;
        console.log(this.registerForm);
        $.post("/user/register",this.registerForm,function (data) {
          console.log(data);
          if (data === "ok"){
            alert("注册成功");
            location.href="/login.html";
          }else{
            alert(data);
          }
        })

      }

    }
    ,
    created(){

    }

  });


</script>
</body>
</html>